<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>注册</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<!--标准mui.css-->
		<link href="css/mui.min.css" rel="stylesheet" />
		<!--App自定义的css-->
		<link rel="stylesheet" href="css/register.css" />
		<!--App默认样式-->
		<link rel="stylesheet" href="css/default.css" />
		<!--引人jquery-->
		<script type="text/javascript" src="js/jquery-2.1.0.js" ></script>
		<script type="text/javascript" src="js/nav.js"></script>
		<script type="text/javascript" src="js/jquery.params.js" ></script>
	</head>

	<body>
		<!--log-->
		<div class="regBanner">
			<img src="image/log.png" />
		</div>
		<!--头像-->
		<div class="head-img">
			<img />
			
		</div>
		<!--注册信息-->
		<div class="regTxet">
				<input type="text" placeholder="请输入姓名" class="regName"/>
				<input type="number" placeholder="请输入手机号" class="regPhone"/>
				<div class="verification">
					<input type="text" placeholder="请输入验证码" class="verifications"/>
					<input class="verBtn" value="获取验证码" type="button"></input>
				</div>
				<p class="rgeTip">无法收到验证码?<i>重新发送</i></p>
		</div>
		<!--注册按钮-->
		
		<button class="regBtn">
			注册
		</button>
		</div>
		<!--协议-->
		<div class="agreement">
			<p>注册即表示同意<i>《服务协议》</i></p>
		</div>
		            
            <div class="sated"></div>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript">
			mui.init()
		</script>
		<script>
			var userName = '';
			
			$(document).ready(function(){
				$(".regBtn").click(function(){
					var nameValue = $('.regName').val();
					var regName = /^[\u4E00-\u9FA5]{1,6}$/;
					var phoneValue = $('.regPhone').val();
					var regPhone = /^[1][3,4,5,7,8][0-9]{9}$/;
					var verValue = $('.verifications').val();
					console.log(verValue.length)
					if(nameValue == ""){
						mui.toast('请填写你的姓名！')
					} else if(!regName.test(nameValue)){
						mui.toast('姓名格式不正确！')
					} else{
						if(phoneValue == ""){
							mui.toast('请输入你的手机号！')
						}else if(!regPhone.test(phoneValue)){
							mui.toast('手机格式不正确！')
						} else if(verValue == ""){
						mui.toast('请输入验证码!')
						
					}else{
						//账号
						userNum = phoneValue;
						console.log(userNum)
						 mui.alert('注册成功！','提示','确定',function (e) {
//						 	url = "login.html?="+userName+
						    $(window).attr('location',"login.html?num="+userNum); 
						 },'div')
							
					    }
					}
					
				})
			})
		</script>
		<!--注册-->
		<script>
			//注册页面文字提示
			$(function(){
			//姓名
				$('.regName').blur(function(){
					var regName = /^[\u4E00-\u9FA5]{1,6}$/;
                    var inputValue = $(this).val();
                    console.log(regName.test(inputValue))
					if(inputValue == ""){
						mui.toast('姓名不能为空！')
					} else if(!regName.test(inputValue)){
						mui.toast('姓名格式不对！')
                   }
				});
				//手机号
			$('.regPhone').blur(function(){
					var regPhone = /^[1][3,4,5,7,8][0-9]{9}$/;
                    var inputValue = $(this).val();
                    if(inputValue == ""){
                    	mui.toast('手机号不能为空!')
                    } else if(!regPhone.test(inputValue)){
                    	mui.toast('手机格式不对！')
                    }
				});
				//获取验证码
				$('.verBtn').click(function(){
					var nameValue = $('.regName').val();
					var regName = /^[\u4E00-\u9FA5]{1,6}$/;
					var phoneValue = $('.regPhone').val();
					var regPhone = /^[1][3,4,5,7,8][0-9]{9}$/;
					if(nameValue == ""){
						mui.toast('请填写你的姓名！')
					} else if(!regName.test(nameValue)){
						mui.toast('姓名格式不正确！')
					}else{
						if(phoneValue == ""){
							mui.toast('请输入你的手机号！')
						}else if(!regPhone.test(phoneValue)){
							mui.toast('手机格式不正确！')
						}else{
							var verText = 60;
					var  $that= $(this)
			      var time = setInterval(() => {
						verText--;
						$that.val(verText+"秒").attr("disabled", "disabled");
						$that.css('color','#ccc')
				     	if(verText <= 0){
			           clearInterval(time)
			           $that.val('重新发送').removeAttr("disabled")
			           $that.css('color','rgb(163,211,187)')
					}
					},1000);
						}
					}
				});
				//验证码失去焦点
				$('.verifications').blur(function(){
					var verValue = $(this).val();
					if(verValue == ""){
						mui.toast('请输入你的验证码!')
					}
				});
				
			})
			
		</script>
	</body>

</html>